<template>
  <div>
    <e-table
      @getList="handleGetList"
      :tableData="tableData"
      :columns="columns"
      :loading="loading"
      :total="total"
      :border="false"
    >
      <el-table-column :label=" mdl.planType === 1 ? '区域名称' : '部门名称'" slot="name" align="center">
        <span
          class="fl"
          slot-scope="scope"
        >{{ mdl.planType === 1 ? scope.row.areaName : scope.row.deptName }}</span>
      </el-table-column>
      <el-table-column slot="picture" label="照片" align="center" width="60px">
        <span slot-scope="scope">
          <el-button
            v-if="scope.row.pictureUrl.length > 0"
            type="text"
            @click="handlePreview(record)"
          >{{scope.row.pictureUrl.length}}张</el-button>
          <span v-else>无</span>
        </span>
      </el-table-column>
      <el-table-column slot="state" label="资产状态" align="center" width="60px">
        <span slot-scope="scope">
          <el-tag type="success" v-if="scope.row.state === 0">正常</el-tag>
          <el-tag type="danger" v-else>禁用</el-tag>
        </span>
      </el-table-column>
      <el-table-column slot="time" label="盘点时间" width="150" align="center">
        <span slot-scope="scope">
          <span>{{ formatTime(scope.row.checkTime) }}</span>
        </span>
      </el-table-column>
    </e-table>
    <preview-modal ref="previewModal" />
  </div>
</template>

<script>
import { queryCheckList } from '@/api/assetsNew'
import PreviewModal from '@/components/PreviewModal'

export default {
  components: {
    PreviewModal
  },
  data() {
    return {
      loading: false,
      // 查询参数
      queryParam: {
        pageNo: 1,
        pageSize: 10,
        planId: null
      },
      // 表头
      columns: [
        { slot: 'name' },
        {
          label: '固定资产名称',
          prop: 'assetsName',
          align: 'left'
        },
        { slot: 'picture' },
        {
          label: '盘点人',
          prop: 'checkUser'
        },
        { slot: 'time' },
        {
          label: '描述',
          prop: 'checkDescribe',
          align: 'left'
        }
      ],
      tableData: [],
      total: 1,
      mdl: {}
    }
  },
  methods: {
    edit(obj) {
      console.log('task record obj', obj)
      this.mdl = Object.assign({}, obj)
      const { planId, planType } = obj
      this.$set(this.queryParam, 'planId', planId)
      this.handleGetList({ planId }) // , planType: obj.planType
    },
    handlePreview(record) {
      this.$refs.previewModal.show(record.pictureUrl)
    },
    async handleGetList(param = {}) {
      this.loading = true
      const res = await queryCheckList({ ...this.queryParam, ...param })
      if (res && res.data.records.length > 0) {
        const {
          state,
          data: { records, total }
        } = res
        this.tableData = records
        this.total = total
      } else {
        this.tableData = []
        this.total = 1
      }
      this.loading = false
    }
  }
}
</script>
